<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title>Savour - Facebook voting app</title>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta property="og:title" content="Get your insight" />
        <meta property="og:type" content="website" />
        <meta property="og:url" content="http://apps.facebook.com/savourvoting/" />
        <meta property="og:image" content="" />
        <meta property="og:site_name" content="" />
        <meta property="fb:app_id" content="{FB.appId}"/>
        <meta property="og:description" content="" />
        <link href="<?php echo base_url(); ?>style.css" type="text/css" rel="stylesheet"/>
        <script type='text/javascript' src='<?php echo base_url(); ?>jquery.js'></script>	

    </head>
    <body>
        <div id="fb-root">
        </div>
        <script src="//connect.facebook.net/ja_JP/all.js"></script>
        <script type="text/javascript">
            window.fbAsyncInit = function()  {
                FB.init({
                    appId  : '132572970256339',
                    oauth  : true
                });
                FB.Canvas.setAutoGrow();
            };
            //FB.Canvas.scrollTo(0, 0);
            function actionVote(id,pid){
                $(id).find("img").attr("src","<?php echo base_url(); ?>processing.gif");
                $.ajax({					  
                    url: "<?php echo base_url(); ?>index.php/welcome/addVote",					  
                    type: "GET",
                    data: {pid : pid},
                    dataType: "html",
                    success: function(data) {
                        alert("Thank you for voting.Enjoy the recipes and try some at home !");
                        $(id).hide();	
                    }					
                });
                
                //$(id).hide();
            }
            function show_desc(desc_id)
            {
                var desc_product=$('#'+desc_id).text();
                $('#show_desc').html(desc_product);
                $('#show_desc').show();
            }
        </script>
        
       
        <div id="wrapper">
            <div id="header">
                <p>Banner</p>            
            </div><!--End #Logo-->
            <div id="content">
                <div class="vote-container">
                    <?php
                    foreach ($products as $i => $product) {
                        ?>
                        <div class="vote-item">
                            <span class="vote-item-title">
                                <?php echo $product->product_name; ?>
                            </span>
                            <img width="100%" src="<?php echo base_url() . $product->img_url; ?>">
                            <div class="vote-item-action">
                                <span class="vote-item-action-img">
                                    <img src="<?php echo base_url(); ?>images/i-icon.png">
                                </span>
                                <span class="vote-item-action-more" style="cursor:pointer" onclick="show_desc('<?php echo 'desc' . $product->product_id; ?>')">
                                    More info
                                </span>
                                <?php
                                if (in_array($product->product_id, $voteds)) {
                                    
                                } else {
                                    ?>
                                    <span class="vote-item-action-button" onclick="actionVote(this,<?php echo $product->product_id; ?>)">
                                        <img width="100%"height="100%"src="<?php echo base_url(); ?>images/vote-button.png">
                                    </span>
                                    <?php
                                }
                                ?>
                            </div>

                            <div id="desc<?php echo $product->product_id; ?>" style="display: none">
                                <?php echo $product->description; ?></div>
                        </div>
                        <?php
                        if ($i == 4) {
                            ?>
                    <div id="show_desc" style="border: 1px solid #001;float: left;height: 200px;width: 100%; display: none;"></div>
                            <?php
                        }
                    }
                    ?>



                </div>
            </div>
            <div id="footer">
                <p>Copyrights &COPY; 2013 by Hoovix <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Feyeredsoftware&amp;send=false&amp;layout=button_count&amp;width=200&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&amp;appId=113698288782115" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; float: right; width: 98px; height: 21px; margin-top: 12px;" allowTransparency="true"></iframe></p>
            </div><!--End #Footer-->
        </div><!--End #Wrapper-->
    </body>
</html>
